import React from "react";
import {inject, observer} from "mobx-react";
import * as mobx from 'mobx';
import {WeaLocaleProvider, WeaTab, WeaDialog, WeaAlertPage} from "ecCom";
import CertInfo from "./CertInfo";
import TamperInfo from "./TamperInfo";

import "./style/index.less";

const getLabel = WeaLocaleProvider.getLabel;

@observer
export default class Main extends React.Component {
    constructor(props) {
        super(props);
    }

    changeTab = (tkey) =>  {
        const {secondAuthStore} = this.props;
        secondAuthStore.changeTab(tkey);
    }

    //关闭
    closeDialog = () =>  {
        if (this.props.onClose) {
            this.props.onClose();
        }
        this.resetStore();
    }

    resetStore = () =>  {
        const {secondAuthStore} = this.props;
        secondAuthStore.changeTab("tamperInfo");
        secondAuthStore.setLogId();
    }

    componentWillReceiveProps(nextProps) {
        const {visible} = this.props;
        if (this.props.visible != nextProps.visible && nextProps.visible) {
            this.loadAuthDetail();
        }
    }

    componentDidMount() {
        const {visible} = this.props;

        if (visible) {
            this.loadAuthDetail();
        }
    }

    loadAuthDetail() {
        const {secondAuthStore} = this.props;
        secondAuthStore.loadAuthDetail();
    }

    getDialogContent() {
        const {visible, secondAuthStore} = this.props;
        const {tabs, selectedKey, tamperInfo, certInfo} = secondAuthStore;
        const tabDatas = mobx.toJS(tabs);

        const tamperData = mobx.toJS(tamperInfo);
        const certData = mobx.toJS(certInfo);

        const dialogContent = [];

        const {checkResult = 0} = tamperData;

        if (checkResult == "9") {
            dialogContent.push(<CertInfo ecId={`${this && this.props && this.props.ecId || ''}_CertInfo@rysgqn@ec1`} data={[...certData]}/>);
        } else {
            dialogContent.push(
                <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@qrhmke@ec2`}
                    datas={tabDatas}
                    keyParam="tabKey"
                    selectedKey={selectedKey}
                    onChange={this.changeTab}
                />
            );

            dialogContent.push(selectedKey == "certInfo" && certData.length > 0 && <CertInfo ecId={`${this && this.props && this.props.ecId || ''}_CertInfo@s935ub@ec3`} data={[...certData]}/>);
            dialogContent.push(selectedKey == "tamperInfo" && <TamperInfo ecId={`${this && this.props && this.props.ecId || ''}_TamperInfo@5kxq6s@ec4`} {...tamperData}/>);
        }

        return dialogContent;
    }

    render() {
        const {visible, secondAuthStore} = this.props;
        const {APIResult, tamperInfo} = secondAuthStore;
        const tamperData = mobx.toJS(tamperInfo);
        const apiData = mobx.toJS(APIResult);
        const {success: apiSuccess = "1", message: apiMsg} = apiData;


        const {checkResult = 0} = tamperData;

        const onCancel = this.closeDialog;
        let title = getLabel(501209, "数据保护");
        let style = {width: 800, height: 600};

        if (checkResult == "9") {     //契约锁二次认证
            title = getLabel(501463, "证书信息");
            // style = {width: 550, height: 300};
        }


        const hasScroll = true;
        const moduleName = "workflow";

        const dialogParams = {title, style, visible, onCancel, hasScroll, moduleName};

        return (
            <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@72ho5s`} {...dialogParams}>
                {
                    apiSuccess == "1" ?
                        this.getDialogContent()
                        :
                        <WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@506u0u`}>
                            <div>{apiMsg}</div>
                        </WeaAlertPage>
                }
            </WeaDialog>
        );
    }
}